<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="component/heard :: head"></head>
<body>
<nav th:include="component/nav :: nav"></nav>
<link rel="stylesheet" href="/js/bootstrap-table.min.css">
<script src="/js/bootstrap-table.min.js"></script>
<script src="/js/mycard.js"></script>
<div class="container" style="font-size: 14px;">
    <table id="table2"></table>
    <button id="saveBth" type="button" class="btn btn-sm btn-primary">保存</button>
    <input type="text" id="cardId" class="form-control" th:value="${card?.id}" hidden>
    <input type="text" id="cardSelect" class="form-control" th:value="${card?.getUserListJsonStr()}" hidden>
</div>
</body>
<script>
    const table2 = {
        $table: $('#table2'),
        init: function () {
            this.$table.bootstrapTable({
                url: "/my/account",
                method: "GET",
                dataType: "json",//数据类型
                sidePagination: "server",
                pagination: true,
                showHeader: true,
                pageSize: false,
                //height: 700,
                toolbar: '#toolbar',
                clickToSelect: false,
                uniqueId: "id",
                pageNumber: 1,
                pageList: 10,
                cardView: false,
                classes: "table table-sm",
                onlyInfoPagination: true,
                columns: [
                    {
                        "checkbox": true,
                    },
                    {
                        "field": "id",
                        "title": "id",
                        "visible": false
                    },
                    {
                        "field": "username",
                        "title": "username"
                    },
                    {
                        "field": "password",
                        "title": "password"
                    }

                ]
                ,
                queryParams: function (params) {
                },
                responseHandler: function (res) {
                    return eval(res.data);
                },
                onLoadSuccess: function () {
                    let select = $("#cardSelect").val();
                    if (select === "") {
                        return
                    }
                    table2.$table.bootstrapTable('checkBy', {field: 'id', values: JSON.parse(select)})
                },
                onLoadError: function () {
                },
                onDblClickRow: function (row, $element) {
                },
                onClickCell: function (field, value, row, $element) {
                }
            });
        },


    };
    $(function () {
        table2.init();

        $("#saveBth").click(function () {
            let id = $("#cardId").val();
            let list = table2.$table.bootstrapTable('getAllSelections');
            let data = {id: id, userList: list};
            myCard.addTestInfo(data, {
                success: function (obj) {
                    window.location.href = "/card/detail/" + id;
                    alert("保存成功");
                },
                error: function (obj) {
                    alert("保存成功");
                }
            });
        })
    })
</script>
</html>
